<template>
  <div class="bkgl">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="冠心病" name="冠心病"></el-tab-pane>
      <el-tab-pane label="慢阻肺" name="慢阻肺"></el-tab-pane>
      <el-tab-pane label="高血压" name="高血压"></el-tab-pane>
      <el-tab-pane label="糖尿病" name="糖尿病"></el-tab-pane>
      <el-tab-pane label="脑卒中" name="脑卒中"></el-tab-pane>
      <el-tab-pane label="慢性肾脏病" name="慢性肾脏病"></el-tab-pane>
      <el-tab-pane label="肿瘤" name="肿瘤"></el-tab-pane>
    </el-tabs>
    <div class="query">
      报告日期：
      <el-date-picker
        v-model="query.time"
        type="daterange"
        range-separator="至"
        start-placeholder="开始日期"
        end-placeholder="结束日期"
      >
      </el-date-picker>
      审核状态：
      <el-select v-model="query.status" placeholder="请选择">
        <el-option label="全部" value="全部"> </el-option>
        <el-option label="待提交" value="待提交"> </el-option>
        <el-option label="待审核" value="待审核"> </el-option>
        <el-option label="已审核" value="已审核"> </el-option>
        <el-option label="被驳回" value="被驳回"> </el-option>
      </el-select>
      报卡查询：
      <el-input
        v-model="query.name"
        style="width: 200px"
        placeholder="请输入姓名、报卡编号或证件号码查询"
      ></el-input>
      <span style="float: right"
        ><el-button type="primary" icon="el-icon-search">查询</el-button>
        <el-button icon="el-icon-refresh-left">重置</el-button></span
      >
    </div>
    <div class="title" style="margin-top: 10px">
      <span style="font-weight: 900; font-size: 18px; color: #000"
        >{{ activeName }}报卡管理</span
      >
      <span style="float: right">
        <el-button type="primary" @click="to_addCard">新建</el-button>
      </span>
    </div>
    <div class="main" style="margin-top: 25px">
      <el-table
        :data="tableData"
        style="width: 100%; margin-top: 15px"
        :header-cell-style="{
          color: '#000',
          backgroundColor: 'rgb(222,234,255)',
        }"
        height="400"
      >
        <el-table-column prop="reportDate" label="报告日期"> </el-table-column>
        <el-table-column prop="reportStatusName" label="审核状态">
        </el-table-column>
        <el-table-column prop="residentName" label="姓名"> </el-table-column>
        <el-table-column prop="genderName" label="性别"> </el-table-column>
        <el-table-column prop="certificateTypeName" label="证件类型">
        </el-table-column>
        <el-table-column prop="idCard" label="证件号码"> </el-table-column>
        <el-table-column prop="permanentAddressLevelFive" label="现住地址">
        </el-table-column>
        <el-table-column prop="permanentAddress" label="户籍地址">
        </el-table-column>
        <el-table-column label="操作">
          <template>
            <el-button type="text" @click="to_look">查看</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div style="text-align: right; margin-top: 20px">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page.sync="query.page"
        :page-size="query.size"
        layout="prev, pager, next, jumper"
        :total="total"
      >
      </el-pagination>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      activeName: "高血压",
      query: {
        time: [],
        page: 1,
        size: 15,
      },
      tableData: [
        {
          arrivalDate: "2023-09-26 11:44:13",
          cancelReason: null,
          cancelReasonCode: null,
          certificateType: 1,
          certificateTypeName: "身份证",
          contactName: "丁学仕",
          contactPhone: "15969388021",
          created: null,
          currentIs: 1,
          currentLocation:
            "玉龙纳西族自治县疾病预防控制中心,丽江市疾病预防控制中心",
          diseaseInfoStr:
            '{"reportDoctor":"吴向成","fate":"0","firstDiagnosisDate":"2023-08-27 00:00:00","diagnosisDate":"2023-08-27 00:00:00","diagnosisSource":"2","agencyLevel":"1","AcuteMaritalStatus":5,"agencyId":"15263","icd":"I46.1  被描述为心脏性猝死","basis":"[{\\"title\\":\\"临床症状\\",\\"isChe\\":false},{\\"title\\":\\"肌钙蛋白\\",\\"isChe\\":false},{\\"title\\":\\"心电图\\",\\"isChe\\":false},{\\"title\\":\\"血管造影\\",\\"isChe\\":false},{\\"title\\":\\"超声心动图\\",\\"isChe\\":false},{\\"title\\":\\"CT/CTA/SPECT\\",\\"isChe\\":false},{\\"title\\":\\"MRI\\",\\"isChe\\":false},{\\"title\\":\\"腰穿\\",\\"isChe\\":false},{\\"title\\":\\"手术\\",\\"isChe\\":false},{\\"title\\":\\"尸检或病理\\",\\"isChe\\":false},{\\"title\\":\\"补发\\",\\"isChe\\":true}]","inferredType":2,"agencyName":"黎明乡卫生院","reportUnitName":"黎明乡卫生院","replacementType":"死亡补发","reportDate":"2023-09-02 00:00:00","basePatientRelationship":"3","reportUnitId":15263,"reportDepartment":"黎明村卫生室"}',
          diseaseType: 9,
          diseaseTypeName: "心脏性猝死",
          fillingUnitId: "15263",
          fillingUnitName: "黎明乡卫生院",
          gender: 1,
          genderName: "男",
          id: "1995393",
          idCard: "533221194510*****2",
          nowAddress: "路鲁习组",
          nowAddressLevelFive: "玉龙纳西族自治县黎明傈僳族乡黎明村委会",
          nowAddressLevelTwo: "云南省丽江市",
          nowAreaName: null,
          operatorName: "和秀菊",
          orgCategoryType: "",
          originalIdCard: "533221194510012712",
          permanentAddress:
            "云南省丽江市玉龙纳西族自治县黎明傈僳族乡黎明村委会",
          permanentAddressLevelFive: "玉龙纳西族自治县黎明傈僳族乡黎明村委会",
          permanentAddressLevelTwo: "云南省丽江市",
          presentCode: "530721205204",
          registeredCode: "530721205204",
          reportAreaName: null,
          reportBizStatus: 2,
          reportCode: "CC015263230926000001",
          reportDate: "2023-09-02",
          reportDoctor: "吴向成",
          reportSource: null,
          reportStatus: 2,
          reportStatusName: "待审核",
          reportStatusValue: "待疾控审核",
          reportType: 3,
          reportUnitId: "15263",
          reportUnitName: "黎明乡卫生院",
          residentId: "2004198712",
          residentName: "丁绍昌",
          residentStatus: null,
          residentStatusName: null,
          sortWay: null,
          telephone: "15969388021",
          unableHandleReason: null,
          unitAreaCode: "",
          unitId: "15263",
          unitStay: "10",
          updated: "2023-09-26 11:44:13",
          uploadSource: "手动上报",
          valid: 0,
          visitStatusName: null,
        },
      ],
    };
  },
  methods: {
    handleClick(val) {},
    handleSizeChange() {},
    handleCurrentChange() {},
    to_addCard() {
      // window.open("/#/BKXT/add/addCard");
      this.$router.push("/BKXT/add/addCard");
    },
    to_look() {
      this.$router.push("/BKXT/look/look");
    },
  },
};
</script>

<style>
.bkgl {
  padding: 15px;
  background-color: #fff;
  height: calc(100vh - 46px);
}
</style>